<template>
	<view>
		<scroll-view scroll-y="true" :refresher-enabled="false" @scrolltolower="loadMoreFn" refresher-threshold="100"
			@refresherrefresh="onRefresh" :style="`height: ${props.height}`">
			<slot :list="list"></slot>
		</scroll-view>
	</view>
</template>

<script setup>
	import {
		ref,
		computed,
		watch
	} from "vue";
	import {
		onShow
	} from '@dcloudio/uni-app';
	import {
		useInfiniteList
	} from "./loadMore.js";
	const props = defineProps({
		params: {
			type: Object,
			default: function() {
				return {}
			}
		},
		requestUrl: String,
		requestType: {
			type: String,
			default: 'get'
		},
		height: {
			type:String,
			default: function() {
				return '68vh'
			}
		}
	})
	const num = ref(1);
	const {
		loading,
		list,
		hasMore,
		search,
		loadMore
	} = useInfiniteList({
		url: props.requestUrl,
		params: props.params,
		requestType: props.requestType
	});

	const loadMoreFn = () => {

		if (hasMore.value) {
			console.log(num)
			loadMore(() => num.value++);
		} 
		// if (!hasMore.value) {
		//    // 没有更多
		//    if (num.value >= chunkList.value.length) return; // 已经是最后一页
		//    num.value++; // 跳到下一页
		//  } else {
		//    // 有更多
		//    if (num.value < chunkList.value.length) {
		//      // 有下一页
		//      if (chunkList.value[num.value].length < props.step) {
		//        // 剩余数据不足一页
		//        loadMore(() => num.value++); // 补足下一页数据
		//      } else {
		//        num.value++; // 跳到下一页
		//      }
		//    } else {
		//      loadMore(() => num.value++); // 加载更多数据
		//    }
		//  }
	}

	const onRefresh = () => {
		num.value = 1;
console.log('aaa')
		search(props.params);
	}

	watch(
		() => props.params,
		() => {
			num.value = 1;
			console.log('change====')
			search(props.params);
		}, {
			deep: true,
			immediate: true
		}
	);

	onShow(() => {
		search(props.params);
	})
</script>

<style>

</style>